<style lang="less" scoped>
@c-primary: #3399ff;
@c-red: #f55;
@c-origin: #cc4;
.status {
  border: 1px solid @c-primary;
  border-radius: 4px;
  padding: 2px 6px;
  color: @c-primary;
  font-size: 12px;
}
.primary {
  border: 1px solid @c-primary;
  color: @c-primary;
}
.red {
  border: 1px solid @c-red;
  color: @c-red;
}
.origin {
  border: 1px solid @c-origin;
  color: @c-origin;
}
</style>

<template>
  <span :class="['status',cls]">{{status}}</span>
</template>
<script>
export default {
  props: ['status'],
  computed: {
    cls() {
      if (this.status === '在业') return 'origin';
      if (this.status === '存续') return 'primary';
      if (this.status === '注销') return 'red';
    }
  }
};
</script>
